<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<title>Register</title>

		<!-- 导入我们bootstrap官网的连接与图标 -->
		<link rel="stylesheet" href="../bootstrap-4.6.1-dist/css/bootstrap.min.css" />
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">


		<!--用百度的静态资源库的cdn安装bootstrap环境-->
		<!-- Bootstrap 核心 CSS 文件 -->
		<link href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
		<!--font-awesome 核心我CSS 文件-->
		<link href="//cdn.bootcss.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
		<!-- 在bootstrap.min.js 之前引入 -->
		<script src="http://apps.bdimg.com/libs/jquery/2.0.0/jquery.min.js"></script>
		<!-- Bootstrap 核心 JavaScript 文件 -->
		<script src="http://apps.bdimg.com/libs/bootstrap/3.3.0/js/bootstrap.min.js"></script>


	</head>
	<body>
		<div class="container">
			<div class="form row">
				<form class="form-horizontal col-sm-offset col-md-offset-3">
					<h3 class="form-title">注册</h3>
					<div class="col-sm-9 col-md-9">
						<div class="form-group">
							<!--用户名图标和用户名输入框-->
							<i class="fa fa-user" aria-hidden="true"></i>用户
							<input class="form-control required" type="text" name="username" id="username"
								placeholder="请输入用户名" required>
						</div>

						<!--密码图标和密码输入 -->
						<div class="form-group">
							<i class="fa fa-key" aria-hidden="true"></i>密码
							<input class="form-control required" type="password" name="password" id="password"
								placeholder="请输入密码" required>
						</div>

						<!-- 性别-->
						<div class="form-group">
							<i class="bi bi-gender-trans" aria-hidden="true"></i>性别
							<input type="radio" name="sex">男
							<input type="radio" name="sex">女

						</div>

						<!-- 爱好和爱好图标 -->
						<div class="form-group">
							<i class="bi bi-person-hearts" aria-hidden="true">爱好</i>
							<select name="hobby" id="hobby">
								<option value="篮球">篮球</option>
								<option value="足球">足球</option>
								<option value="棒球">棒球</option>
								<option value="乒乓球">乒乓球</option>
								<option value="羽毛球">羽毛球</option>
								<option value="网球">网球</option>
							</select>
						</div>
						<!-- 出生日期 -->
						<div class="form-group">
							<i class="bi bi-balloon-heart-fill" aria-hidden="true">出生日期</i>
							<input type="date" name="datetime" id="datetime" value="">
						</div>

						<!--注册按钮-->
						<div class="form-group">
							<input type="submit" value="注册" class="btn btn-success pull-right">
						</div>


					</div>
				</form>
			</div>
		</div>
	</body>
</html>
